<template>
	<gui-page class="gui-bg-white">
		<template v-slot:gBody>
			<cardHeader :title="`${devname} - ${devtype} - 设备id=${devid} - (记录总数：${total} ,第${page}页/共${pagecount}页)`"></cardHeader>
			<view 
			class="gui-bg-white gui-dark-bg-level-3 gui-padding gui-margin-top">
				<view v-for="(item, index) in items" :key="item.id" @click="gotoRTData(item)">
					<cardBody :icon="'&#xe6cf;'" :title="`id=${item.id}`" :value="`${item.update_time}`" 
					:desShow="'1'" :arrowShow="'1'" 
					:description="`A相电压(V):${item.ua} ; b相电压(V):${item.ub} ; c相电压(V):${item.uc} ; A相电流(A):${item.ia * ctbb} ; B相电流(A):${item.ib * ctbb}`"
					:iconClass="'gui-color-blue'"></cardBody>			
				</view>
			</view>
			<cardFooter
				:description="`记录总数：${total} , 第${page}页/共${pagecount}页 - 每页：${perpage}`"
				@golastpage="golastpage"
				@gonextpage="gonextpage"
			></cardFooter>
		</template>
	</gui-page>
</template>

<script setup>
	import {
		ref,
		getCurrentInstance,
		createApp
	} from 'vue'
	import {
		onLoad,
		onPullDownRefresh
	} from '@dcloudio/uni-app'
	import cardHeader from '@/lib/components/card-header.vue'
	import cardBody from "@/lib/components/card-body.vue"
	import cardFooter from "@/lib/components/card-footer.vue"
	import guiPage from '@/Grace6/components/gui-page.vue'
	import ybmethod from '../../lib/js/ybmethod'
	import ybgolbal from '../../lib/js/ybgolbal.js'
	const app = createApp();
	const ybapi = ybgolbal.getybapi(getCurrentInstance());
	let mc = ref("");
	let devid = ref(0);
	let xlh = ref("");
	let devname = ref("");
	let devtype = ref("");
	let items = ref([]);
	let page = ref(1);
	let perpage = ref(20);
	let total = ref(0);
	let pagecount = ref(0);
	let ctbb = ref(0);
	onLoad((option) => {
		console.log("option数据：")
		console.log(option)
		devid.value = option.devid;
		mc.value = option.mc;
		xlh.value = option.xlh;
		devname.value = option.devname;
		devtype.value = option.devtype;
		ctbb.value = option.ctbb;
		console.log(option);
		console.log("测试：")
		console.log(xlh.value == "db")
		backiotdata()
	});
	onPullDownRefresh(() => {
		ybmethod.onPullDownRefresh(backiotdata);
	})
	
	// 方案二
	function backiotdata(){
		ybapi.Devices_GetRTData(devid.value,xlh.value,"id desc","*",page.value,perpage.value,function(data){
			console.log(data)
			if(data.total>0){
				items.value = data.items;
				total.value = data.total;
				pagecount.value = ybmethod.divideWithRemainderPlusOne(data.total, perpage.value);
			}	
		},function(e){
			console.log(e);
		});	
	}
	
	// 方案一

	// function backiotdata() {
	// 	if (xlh.value == "db") {
	// 		// 获取db数据
	// 		ybapi.Backiotdatadb_FastList(page.value, perpage.value, devid.value, function(data) {
	// 			console.log("db测试：")
	// 			console.log(data)
	// 			console.log(data.list)
	// 			items.value = data.list;

	// 		}, function(e) {
	// 			console.log(e);
	// 		});

	// 		// 获取db总数
	// 		ybapi.Backiotdatadb_Gettotal(devid.value, function(data) {
	// 			console.log("总数：");
	// 			console.log(data.total);
	// 			total.value = data.total;
	// 			pagecount.value = ybmethod.divideWithRemainderPlusOne(data.total, perpage.value);
	// 		}, function(e) {
	// 			console.log(e);
	// 		});
	// 	};
	// 	if (xlh == "wgbc") {
	// 		// 获取wgbc数据
	// 		ybapi.Backiotdatawgbc_FastList(page.value, perpage.value, devid.value, function(data) {
	// 			items.value = data.list;
	// 		}, function(e) {
	// 			console.log(e);
	// 		});

	// 		// 获取wgbc总数
	// 		ybapi.Backiotdatawgbc_Gettotal(devid.value, function(data) {
	// 			total.value = data.total;
	// 			pagecount.value = ybmethod.divideWithRemainderPlusOne(data.total, perpage.value);
	// 		}, function(e) {
	// 			console.log(e);
	// 		});
	// 	}
	// }

	function fillitems() {}

	function golastpage() {
		if (page.value > 1) {
			page.value = page.value - 1;
		}
		backiotdata();
	}

	function gonextpage() {
		page.value = page.value + 1;
		backiotdata();
	}

	function gotoRTData(item) {
		console.log(item);
		uni.navigateTo({
			url: "/pages/rtdata/rtdata?devid=" + devid.value + "&rtid=" + item.id + "&ctbb=" + ctbb.value + "&xlh=" +
				xlh.value + "&devname=" + devname.value + "&mc=" + mc.value + "&devtype=" + devtype.value,
		});
	}
	app.component({
		cardHeader,
		cardBody,
		cardFooter,
		guiPage
	});
</script>

<style scoped>
	@import "../../lib/css/ybcard.css";
</style>